<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>pratice</title>
        <style>
            div{
                width:300px;
            }
            
            #content{
                height:400px;
                border:1px solid #ccc;
                box-shadow: 2px 2px 5px 0px blueviolet;
                border-radius: 0px 0px 10px 10px;
                margin:30px;
                padding:5px;
            }
            hr{
                margin:5px 0px;
                color:#e3ecf5;
            }
            p{text-align:center;}
        </style>
    </head>
    <body>
        <div id="content">
            <p>HTML学习笔记</p>
            <hr>
            盒子模型是CSS中一个重要的概念，
            <hr>
            要好好理解盒子模型的概念和用法，
            <hr>
            HTML元素实质上就是一个个盒子。
            <hr>
            HTML元素实质上就是一个个盒子。
            <hr>
            HTML元素实质上就是一个个盒子。
            <hr>
            HTML元素实质上就是一个个盒子。
            <hr>
            HTML元素实质上就是一个个盒子。
            <hr>
            HTML元素实质上就是一个个盒子。
            <hr>
        </div>
    </body>
</html>